var comments_list = document.querySelector("#comments-list");
/*
<li>
              <div class="comment-main-level">
                <!-- Avatar -->
                <div class="comment-avatar"><img
                    src="http://i9.photobucket.com/albums/a88/creaticode/avatar_1_zps8e1c80cd.jpg" alt=""></div>
                <!-- Contenedor del Comentario -->
                <div class="comment-box">
                  <div class="comment-head">
                    <h6 class="comment-name by-author"><a href="http://creaticode.com/blog">Agustin Ortiz</a>
                    </h6>
                    <span>hace 20 minutos</span>

                    <i class="bi bi-reply-fill"></i>
                    <i class="bi bi-hand-thumbs-up-fill">2</i>
                  </div>
                  <div class="comment-content">
                    Lorem ipsum dolor sit amet, consectetur adipisicing elit. Velit omnis animi et iure
                    laudantium vitae, praesentium optio, sapiente distinctio illo?
                  </div>
                </div>
              </div>

            </li>
*/

// http://124.221.62.120:3000/my/getallcomment/view/243827
//获取评论
// console.log(newsid.newsid);
function getCommentByNewsId() {
  fetch(`${apirUrl}/my/getallcomment/view/${newsid.newsid}`, requestOptions)
    .then((response) => response.json())
    .then((result) => {
      console.log(result);
      if (result.status == 1) {
        comments_list.innerHTML = "暂无评论";
        return;
      }
      var comment_list_html;
      for (let i = 0; i < result.length; i++) {
        comment_list_html = `
        <li>
                <div class="comment-main-level">
                  <!-- Avatar -->
                  <div class="comment-avatar"><img
                      src="${apirUrl}${result[i].userimg}" alt=""></div>
                  <!-- Contenedor del Comentario -->
                  <div class="comment-box">
                    <div class="comment-head">
                      <h6 class="comment-name by-author"><a href="#">${result[i].username}</a>
                      </h6>
                      <input type="hidden" class="hidden_id" value="${result[i].id}">
                      <span>${result[i].date}</span>
                      <span style="margin-left:10px;">${result[i].address}</span>
  
                      <i class="bi bi-reply-fill"></i>
                      <i class="bi bi-hand-thumbs-up-fill vote_comment_btn">${result[i].voteNum}</i>
                    </div>
                    <div class="comment-content">
                      ${result[i].text}
                    </div>
                  </div>
                </div>
  
              </li>`;
        comments_list.innerHTML += comment_list_html;
      }
    })
    .catch((error) => console.log("error", error));
}
getCommentByNewsId();

//发布评论
var comment_texteara = document.querySelector("#comment_texteara");
var put_comment_btn = document.querySelector("#put_comment_btn");
put_comment_btn.addEventListener("click", function () {
  var myHeaders = new Headers();
  myHeaders.append("Authorization", localStorage.getItem("token"));

  var urlencoded = new URLSearchParams();
  urlencoded.append("newsid", newsid.newsid);
  urlencoded.append("text", comment_texteara.value);

  var requestOptions = {
    method: "POST",
    headers: myHeaders,
    body: urlencoded,
    redirect: "follow",
  };

  fetch(`${apirUrl}/my/insertcomment`, requestOptions)
    .then((response) => response.json())
    .then((result) => {
      console.log(result);
      if (result.status == 1) {
        me_uto.innerHTML = "评论失败";
        toast_body.innerHTML = "您未登录，即将跳转到登录页面！";
        toast.show();
        setTimeout(function () {
          window.location.href = "./login.html";
        }, 2000);
      } else if (result.status == 0) {
        me_uto.innerHTML = "评论成功";
        toast_body.innerHTML = "您的评论已发布！";
        toast.show();
        getCommentByNewsId();
        comment_texteara.value = "";
      }
    })
    .catch((error) => console.log("error", error));
});
//延时获取dom
setTimeout(function () {
  var vote_comment_btn = document.querySelectorAll(".vote_comment_btn");
  var hidden_id = document.querySelectorAll(".hidden_id");

  //   console.log(vote_comment_btn[2].innerHTML++);
  //
  for (let i = 0; i < vote_comment_btn.length; i++) {
    vote_comment_btn[i].addEventListener("click", function () {
      var myHeaders = new Headers();
      myHeaders.append("Authorization", localStorage.getItem("token"));

      var urlencoded = new URLSearchParams();
      urlencoded.append("id", hidden_id[i].value);

      var requestOptions = {
        method: "POST",
        headers: myHeaders,
        body: urlencoded,
        redirect: "follow",
      };

      fetch(`${apirUrl}/my/votecomment`, requestOptions)
        .then((response) => response.json())
        .then((result) => {
          console.log(result);
          if (result.status == 0) {
            me_uto.innerHTML = "点赞成功";
            toast_body.innerHTML = "点赞成功！";
            toast.show();
            this.innerHTML++;
          } else if (result.status == 1) {
            me_uto.innerHTML = "点赞失败";
            toast_body.innerHTML = "您未登录，即将跳转到登录页面！";
            toast.show();
            setTimeout(function () {
              window.location.href = "./login.html";
            }, 2000);
          }
        })
        .catch((error) => console.log("error", error));
    });
  }
}, 2000);
// vote_comment_btn.addEventListener("click", function () {});
